﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
        <title>Earthwatchers Admin - Earthwatchers</title> 
        <script src="jquery-1.6.2.min.js" type="text/javascript"></script>
        <script src="jquery.base64.js" type="text/javascript"></script>

        <script type="text/javascript">
            function getAuthString() {
                return "Basic " + $.base64Encode(document.getElementById("tbUsername").value + ":" + document.getElementById("tbPassword").value);
            }

            $(function () {
                $(".addEarthwatcher").click(function () {
                    var name = $("input#TigName").val();
                    if (name == "") {
                        alert("error: give tig username");
                        return false;
                    }
                    $.ajax({
                        url: "/api/earthwatchers",
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader("Authorization", getAuthString());
                        },
                        type: "POST",
                        data: "{\"Name\":\"" + $("#TigName").val() + "\",\"Role\":\"" + $("#Role").val() + "\", \"Basecamp\":\"" + $("#basecamp").val() + "\" }",
                        contentType: "application/json ; charset=utf-8",
                        dataType: "json",
                        success: function () {
                            alert("Congratulations, earthwatcher is added and land is assigned.");
                        },
                        error: function (xhr, textStatus, errorThrown) {
                            alert("error, user does already exist? " + name);
                        }
                    });
                    return false;
                });
            });

            $(function () {
                $(".deleteEarthwatcher").click(function () {
                    var id = $("input#earthwatcherid").val();
                    if (id == "") {
                        alert("error: give earthwatcherid");
                        return false;
                    }
                    $.ajax({
                        type: "DELETE",
                        url: "/api/earthwatchers/"+id,
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader("Authorization", getAuthString());
                        },
                        success: function () {
                            alert("Congratulations, earthwatcher is deleted.");
                        },
                        error: function (xhr, textStatus, errorThrown) {
                            alert("error, earthwatcher does not exist? " + id);
                        }
                    });
                    return false;
                });
            });

            $(function () {
                $(".reassignEarthwatcher").click(function () {
                    var id = $("input#idReassign").val();
                    if (id == "") {
                        alert("error: give earthwatcherid");
                        return false;
                    }
                    $.ajax({
                        type: "POST",
                        url: "/api/earthwatchers/" + id +"/reassignland",
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader("Authorization", getAuthString());
                        },
                        success: function () {
                            alert("Congratulations, earthwatcher is reassigned.");
                        },
                        error: function (xhr, textStatus, errorThrown) {
                            alert("error, earthwatcher does not exist? " + id);
                        }
                    });
                    return false;
                });
            });

            $(function () {
                $(".updateRoleEarthwatcher").click(function () {
                    var id = $("#updateEarthwatcherId").val();
                    if (id == "") {
                        alert("error: give earthwatcherid");
                        return false;
                    }
                    $.ajax({
                        type: "PUT",
                        data: "{\"Id\":\"" + id + "\",{\"Role\":\"" + $("#updateEarthwatcherRole").val() + "\" }",
                        contentType: "application/json ; charset=utf-8",
                        url: "/api/earthwatchers/" + id,
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader("Authorization", getAuthString());
                        },
                        success: function () {
                            alert("Congratulations, earthwatcher is updated.");
                        },
                        error: function (xhr, textStatus, errorThrown) {
                            alert("error updating earthwatcher " + id);
                        }
                    });
                    return false;
                });
            });
        </script>
    </head> 
    <body>
        <h3>Earthwatchers</h3>
        <h4>Show Earthwatcher</h4>
        <a href="/api/earthwatchers">show list of all earthwatchers</a><br/>
        <br/>
        <br>
        username: <input type="text" id="tbUsername"/><br />
        password: <input type="password" id="tbPassword"/>

        <h4>Add Earthwatcher (authenticated)</h4>
        <form name="addEarthwatcher">
          <label for="Name">Taking IT Global username: </label>
          <input type="text" name="TigName" id="TigName"/><br />
            Role: <select id="Role">
                      <option value="0" selected>Earthwatcher</option>
                      <option value="1">Moderator</option>
                      <option value="2">Admin</option>
                  </select><br />
            Basecamp: <select id="basecamp">
                      <option value="borneo" selected>Borneo</option>
                      <option value="argentina">Argentina</option>
                  </select><br />
           <input type="submit" value="vuur!" class="addEarthwatcher"/>
        </form>
        <br/>
        <h4>Delete Earthwatcher (authenticated)</h4>
        <form name="deleteEarthwatcher">
          <label for="ID">Earthwatcher ID: </label>
          <input type="text" name="earthwatcherid" id="earthwatcherid"/>
           <input type="submit" value="vuur!" class="deleteEarthwatcher"/>
        </form>
        <br/>
        <h4>Reassign Earthwatcher (authenticated)</h4>
        warning 1: the old land will get the status 'unwatched' and will not be used anymore<br />
        warning 2: reassign only works in borneo area<br />
        <form name="reassignEarthwatcher">
          <label for="ID">Earthwatcher ID: </label>
            <input type="text" name="earthwatcherid" id="idReassign"/>

            Basecamp: <select id="Select1" disabled>
                      <option value="borneo" selected>Borneo</option>
                      <option value="argentina">Argentina</option>
                  </select>
           <input type="submit" value="vuur!" class="reassignEarthwatcher"/>
        </form>
        <br/>

        <h4>Update role Earthwatcher (authenticated)</h4>
        <form name="updateRoleEarthwatcher">
          <label for="ID">Earthwatcher ID: </label>
            <input type="text" name="earthwatcherid" id="updateEarthwatcherId"/>
            <br />
          Role: <select id="updateEarthwatcherRole">
          <option value="0" selected>Earthwatcher</option>
          <option value="1">Moderator</option>
          <option value="2">Admin</option>
          </select><br />
           <input type="submit" value="vuur!" class="updateRoleEarthwatcher"/>
        </form>
        <br/>

        <a href="admin.html">back</a>
    </body> 
</html>